import React, { Component } from 'react'
import { Select, Button } from 'antd'
import store from '../../../../redux/store';
import {updateBaseNum, resetData} from '../../../../redux/action/simpleCounter';

export default class Header extends Component {
  addBaseOptions = [...Array(5)].map((item, i) => ({ label: i + 1, value: i + 1 }))
  onChange = (value) => {
    // console.log('Select change', value);
    store.dispatch(updateBaseNum(value))
  }
  clear() {
    store.dispatch(resetData())
  }
  render() {
    const { simpleCounter } = store.getState()
    return (
      <div>
        <h2>当前结果为：{simpleCounter.count}，当前基数为：{ simpleCounter.baseNum }</h2>
        <Select
          style={{ width: 120 }}
          options={this.addBaseOptions}
          defaultValue={this.addBaseOptions[0]}
          onChange={this.onChange}
        />
        <Button onClick={this.clear}>重置</Button>
      </div>
    )
  }
}
